<template>
	<view class="cate-right">
		<view v-if="classList.length > 0">
		<view class="cate-rdata" v-for="(item, index) in classList" :key="index" @click="goDetails(item)">
			<navigator url="11">
				<image class="image" :src="item.cover_img" lazy-load :lazy-load-margin="0" />
			</navigator>
			<view class="cate-rinfo">
				<view class="cate-rfooter">
					<view class="cate-rtitle">
						{{item.name}}
					</view>
				<!-- 	<view class="" v-if="LinkType == true">
						<text class="cate-rbtn" @click.stop="edit(item)" v-if="item.chase== false">追剧</text>
						<text class="cate-rbtn2" @click.stop="Subscribe(item.video_id)" v-else>更新提醒</text>
					</view> -->
				</view>
				<view class="cate-rdesc" v-if="LinkType == true">
					看到第{{item.sort}}集
				</view>
				<view class="cate-rfooter" v-if="LinkType == true">
					<view class="cate-rnum">更新至{{item.count}}集</view>
				</view>
			</view>
		</view>
		</view>
		<view v-else class="none">
			暂无记录
		</view>
		<van-dialog
			use-slot
			title="请关注公众号"
			:show="show"
			show-cancel-button
			:show-confirm-button='false'
			bind:close='onClose'
		>
			<view style="display: flex;justify-content: center;">
				<image :src="qrCode" mode="widthFix" style="width:200px" show-menu-by-longpress/>
			</view>
		</van-dialog>
	</view>
</template>

<script>
	import {
		getrecordlist,
		getaddPlay,
		Subscribe,
		getisOnline
	} from '@/module/index.js'
	const app = getApp()
	export default {
		data() {
			return {
				classList: [],
				LinkType:  uni.getStorageSync('is_online'),
				params:{
					page:1,
					limit:10,
					total_page:0
				},
				show: false,
				qrCode:null
			}
		},
		onLoad(e){
			uni.setStorageSync('login_message', {
				official_account_id:e?.official_account_id,
				uid:e?.uid,
				video_id:e?.video_id
			})
		},
		onShow() {
			this.getrecordlist()
		},
		onReachBottom(){
			let {total_page,page} = this.params
			if(page>total_page>0){
				return;
			}
			this.getrecordlist()
		},
		methods: {
			getrecordlist() {
				//发起请求
				getrecordlist(this.params).then((res) => {
					if (res.code === 200) {
						this.classList.push(...res.data.data);
						this.params.page++
						this.params.total_page = res.data.total_page
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				}).catch(err => {
					console.log(err)
				})
			},
			goDetails(el) {
				console.log(el)
				if (this.LinkType == false) {
					// uni.navigateTo({
					// 	url: "/wxcomponents/testPage/index?video_id=" + el.video_id +
					// 		'&video_detail_id=' + el.video_detail_id
					// });
				} else {
					uni.navigateTo({
						url: "/wxcomponents/yjy-video-slide/yjy-video-slide?video_id=" + el.video_id +
							'&video_detail_id=' + el.video_detail_id
					});
				}
			},
			edit(item) {
				console.log(item)
				// 发起请求
				let obj = {
					video_id: item.videoItem.video_id,
					video_detail_id: item.videoItem.id,
					sort: item.videoItem.sort
				}
				getaddPlay(obj).then((res) => {
					console.log(res)
					if (res.code === 200) {
						this.getrecordlist()
						// this.edit2()
						this.Subscribe(item.video_id)
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				}).catch(err => {
					console.log(err)
				})
			},
			// 订阅接口
			Subscribe(video_id) {
				let obj = {
					video_id
				}
				let self = this;
				Subscribe(obj).then((res) => {
					if (res.code === 200 && res.data.url) {
						self.qrCode = res.data.url
						self.show = true
					}
				}).catch(err => {
					console.log(err)
				})
			},
			// 订阅
			edit2(item) {
				var self = this
				// wx.requestSubscribeMessage({
				// 	tmplIds: [
				// 		'xdw4IeAJAWdrHqqQcmQvGvqlKEOxawlosj5F1CoiB5c',
				// 		"VmFNZ3ak5cYoQm9jyH8C02c4FWGL7mxPKXjBeC_RI_Y"
				// 	],
				// 	success(res) {
				// 		console.log(res, `成功`)
				// 		let status = res.errMsg
				// 		if (status == "requestSubscribeMessage:ok") {
				// 			uni.showToast({
				// 				title: `订阅更新提醒成功`,
				// 				icon: "none",
				// 				success() {
				// 					let stoTimer = setTimeout(() => {
				// 						clearTimeout(stoTimer)
				// 						stoTimer = null
				// 						self.Subscribe()
				// 					}, 500)
				// 				}
				// 			})
				// 		} else {
				// 			uni.showToast({
				// 				title: `小主求订阅`,
				// 				icon: "none"
				// 			})
				// 		}
				// 	},
				// 	fail(res) {
				// 		console.log(res, `失败`)
				// 	},
				// 	complete() {

				// 	}
				// })
			},
			onClose(){
				this.show = false
			}
		}
	}
</script>

<style scoped>
	/* 详情样式 */
	.cate-right {
		width: 100%;
		padding: 0px 20rpx 100rpx;
		box-sizing: border-box;
	}

	.cate-rdata {
		display: flex;
		padding: 20rpx 0rpx 0;
	}

	.cate-rinfo {
		flex: 1;
		margin-left: 20rpx;
		padding-bottom: 20rpx;
		border-bottom: 1px solid #eee;
		min-width: 1px;

	}

	.cate-rbtn {
		width: 160rpx;
		height: 60rpx;
		border-radius: 8rpx;
		background-color: #e69900;
		text-align: center;
		line-height: 60rpx;
		color: #FFFFFF;
		display: inline-block;
	}

	.cate-rbtn2 {
		width: 160rpx;
		height: 60rpx;
		border-radius: 8rpx;
		background-color: #00AAFF;
		text-align: center;
		line-height: 60rpx;
		color: #FFFFFF;
		display: inline-block;
	}

	.cate-rfooter {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.cate-rnum {
		flex: 1;
		font-size: 24rpx;
	}

	.cate-rdesc {
		display: block;
		font-size: 26rpx;
		font-weight: bold;
		line-height: 36rpx;
		height: 36rpx;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		margin: 30rpx 0rpx;
		color: #faa700;
	}

	.cate-rtitle {
		font-size: 34rpx;
		display: block;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		color: #000000;
		font-weight: bold;
	}

	.image {
		width: 180rpx;
		height: 260rpx;
		border-radius: 10rpx;
	}
	.none{
		margin: auto;
		text-align: center;
		color: #999;
		margin-top: 50rpx;
	}
</style>
